<html>
<head>
    <meta charset="utf-8">
    <base href="http://x-d-y-3-s.oss-cn-hangzhou.aliyuncs.com"/>
    <link rel="stylesheet" type="text/css" href="http://language-pdd.oss-accelerate.aliyuncs.com/pdd.css">
    <link rel="icon" href="">
    <meta name="viewport"
          content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <meta name="format-detection" content="telephoner=no"/>
    <meta name="msapplication-tap-highlight" content="no"/>
    <title></title>
    <script type="text/javascript" src="/files/js/fastclick.js"></script>
    <link rel="stylesheet" type="text/css" href="/files/css/alert.css">
    <script type="text/javascript">
        var _thost = 'http://' + window.location.host;
        var pathArr = window.location.pathname.split("/");
        if (pathArr.length == 3 && pathArr[1] != "") {
            if (pathArr[1].search(".html") != -1) {

            } else {
                _thost = 'http://' + window.location.host + "/" + pathArr[1];
            }
        }
        var _tt = new Date().getTime();
        document.write('<script type="text/javascript" src="http://language-pdd.oss-accelerate.aliyuncs.com/lvskdjfkjdyou/config.js?v=' + _tt + '"> <\/script>');
    </script>
    <script type="text/javascript" src="/js/load.js?v=123"></script>

    <style type="text/css">
        .buttonLeft2 {
            position: absolute;
            width: 100%;
            line-height: 3.3vh;
            height: 3.3vh;
            font-size: 2.5vh;
            width: 10vh;
            right: 15vh;
            bottom: 2.5vh;
            text-align: center;
            background: url("/files/images/common/button1.png");
            background-size: 100%;
        }

        .buttonRight2 {
            position: absolute;
            width: 100%;
            line-height: 3.3vh;
            height: 3.3vh;
            font-size: 2.5vh;
            width: 10vh;
            right: 3vh;
            bottom: 2.5vh;
            text-align: center;
            background: url("/files/images/common/button2.png");
            background-size: 100%;
        }

        .transferMask {
            position: fixed;
            z-index: 98;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.5);
        }

        .transferFrame {
            position: fixed;
            z-index: 99;
            width: 80vw;
            max-width: 80vw;
            top: 50%;
            left: 50%;
            -webkit-transform: translate(-50%, -60%);
            background-color: #fff;
            text-align: center;
            border-radius: 8px;
            overflow: hidden;
            opacity: 1;
            color: white;
        }

        .transferFrame .title {
            padding: 1vw;
            font-size: 4vw;
            line-height: 5vw;
            word-wrap: break-word;
            word-break: break-all;
            color: #000;
            background-color: white;
        }

        .transferFrame .transferConfirm {
            position: relative;
            left: 4vw;
            width: 72vw;
            line-height: 10vw;
            font-size: 4vw;
            display: flex;
            border-radius: 5vw;
        }

        .transferFrame .transferConfirm .confirm {
            display: block;
            -webkit-box-flex: 1;
            flex: 1;
            text-decoration: none;
            -webkit-tap-highlight-color: transparent;
            position: relative;
            margin-bottom: 0;
            color: rgb(255, 255, 255);
            border-top: solid;
            border-color: #e6e6e6;
            border-width: 0px;
            background-color: rgb(64, 112, 251);
            border-radius: 5vw;
        }

        .toRow {
            position: relative;
            width: 100%;
            height: 15vw;
            line-height: 15vw;
            background-color: #fff;
            text-align: center;
            margin-top: 0.3vh;
            color: #000;
            overflow: hidden;
        }

        .toRow .avatar {
            position: absolute;
            top: 1vw;
            left: 4vw;
        }

        .toRow .avatar img {
            position: absolute;
            top: 0;
            left: 0;
            margin-left: 0;
            width: 8vh;
            height: 8vh;
            border-radius: 1vh;
        }

        .toRow .name {
            position: absolute;
            left: 20vw;
            width: 50vw;
            height: 15vw;
            line-height: 15vw;
            font-size: 2.2vh;
            text-align: left;
        }

        .toRow .select {
            position: absolute;
            top: 2.5vw;
            left: 68vw;
            width: 10vw;
            height: 10vw;
            color: #33ddff;
            border: solid .2vw;
            border-radius: 50%;
        }

        .toRow .select img {
            width: 10vw;
            height: 10vw;
        }

        .shortAlert {
            position: fixed;
            top: 45%;
            width: 150px;
            left: 50%;
            margin-left: -65px;
            color: #fff;
            height: 5vh;
            line-height: 5vh;
            font-size: 2.8vh;
            text-align: center;
            z-index: 130;
        }

        .shortAlert .back {
            position: absolute;
            top: 0;
            left: 0;
            background: #000;
            opacity: .6;
            width: 100%;
            height: 100%;
            border-radius: 5vh;
        }

        .shortAlert .text {
            position: relative;
        }

    </style>
    <script type="text/javascript">
        window.addEventListener('load', function () {
            FastClick.attach(document.body);
        }, false);
    </script>

    <script type="text/javascript" src="/pdd2/phoneUsers.js?v=123"></script>

    <style type="text/css">
        .gameItem {
            position: absolute;
            background-color: #291c4d;
        }
    </style>
</head>

<body style="background:url(/files/images/redpackage/redpackage_bg.jpg)">

<div id="loading" style="position: fixed;width:100%;height:100%;top:0;left:0;background: #000">
    <img src="/files/images/common/loading.gif"
         style="top: 40%;position: absolute;left: 50%;margin-left: -45px;margin-top: -45px;"/>
</div>

<div class="main" id="app-main"
     style="position: absolute; width: 100%;margin: 0 auto; background: #0e0226; display: none;">


    <div class="alert" id="valert" v-show="isShowAlert" style="display: none;">
        <div class="alertBack"></div>
        <div class="mainPart">
            <div class="backImg">
                <div class="blackImg"></div>
            </div>
            <div class="alertText">{{alertText}}</div>
            <div v-show="alertType==3">
                <div class="buttonLeft" v-on:click="closeAlert">确定</div>
                <div class="buttonRight pdd00349" v-on:click="closeAlert"></div>
            </div>
            <div v-show="alertType==7">
                <div class="buttonMiddle pdd00350" v-on:click="closeAlert"></div>
            </div>
            <div v-show="alertType==8">
            </div>
        </div>
    </div>


    <div class="shortAlert" v-show="alert.isShow">
        <div class="back"></div>
        <div class="text">{{alert.text}}</div>
    </div>


    <div style="position: absolute;top: 1.5vw;left: 0;width: 100%;height: 12vw;background-color: #622318;font-size: 2.5vh;line-height: 12vw;text-align: left;color: #fff;">
        <div class="pdd00623" style="position: absolute;left: 4vw">

        </div>
        <div class="pdd00624" style="position: absolute;left: 70vw">

        </div>
    </div>

    <div id="memberDiv"
         v-bind:style="'position: absolute;top: 14vw;left: 0;width: 100%;height: ' + (height - 0.14 * width) + 'px;overflow-x: hidden;'">
        <div style="position: relative;">
            <div v-for="item in members"
                 style="position: relative;width: 100%;height: 15vw;line-height: 15vw;background-color: #622318;text-align: center;margin-top: 0.3vh;color: white;overflow:hidden;">
                <div style="position: absolute;top: 1vw;left: 4vw;">
                    <img v-bind:src="item.avatar"
                         style="position: absolute;top: 0;left: 0;margin-left: 0;width: 8vh;height: 8vh;border-radius: 1vh;">
                </div>

                <div style="position: absolute;left: 22vw;width: 50vw;height: 15vw;line-height: 15vw;font-size: 2.2vh;text-align: left;">
                    {{item.name}}
                </div>
                <div style="position: absolute;left: 70vw;width: 15vw;height: 15vw;line-height: 15vw;font-size: 2.2vh;text-align: left;color: #fff">
                    {{item.ticket}}
                </div>

                <div style="position: absolute;top: 2.5vw;left: 85vw;width: 10vw;height: 10vw;line-height: 4.5vw;font-size: 1.5vh;text-align:center;color: #33ddff;border: solid .5vw;border-radius: 50%;"
                     v-show="item.is_cantransfer" v-on:click="clickShowTranfer(item)">
                    <span class="pdd00625" style="position: relative;top: 1vw"></span></p>
                </div>


            </div>
            <div id="moretext"
                 class="pdd00626"
                 style="position: relative;background-color: white;color: black;height: 10vw;text-align: center;line-height: 10vw;font-size: 2.2vh;display: none;">

            </div>
        </div>
    </div>


    <div style="display: none;" v-show="showTranfer">
        <div class="transferMask" style="" v-on:click="hideTranfer"></div>
        <div class="transferFrame" style="">
            <div style="height: 2.2vw;"></div>
            <div class="title pdd00628 pdd00627">{{selectedItem.name}}</div>

            <div style="height: 2.2vw;border-bottom: solid #ccc 0.2vh;"></div>


            <div style="height: 80vw;overflow-x: hidden;">

                <div v-for="toitem in tMembers" class="toRow">
                    <div class="avatar"><img v-bind:src="toitem.avatar"></div>

                    <div class="name">{{toitem.name}}</div>
                    <div class="select" v-on:click="clickTMember(toitem)">
                        <img src="/files/images/activity/icon_checked.png" v-show="toitem.checked">
                        <img src="/files/images/activity/icon_unchecked.png" v-show="!toitem.checked">
                    </div>
                </div>


            </div>

            <div style="height: 2.2vw;border-top: solid #ccc 0.2vh;"></div>
            <div class="transferConfirm" v-on:click="confirmTranfer()">
                <div class="confirm pdd00629"></div>
            </div>
            <div style="height:4vw;"></div>
        </div>
    </div>
</div>
</body>

<script type="text/javascript" src="/files/js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="/files/js/bscroll.min.js"></script>
<script src="https://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script type="text/javascript" src="/files/js/vue.min.js"></script>
<script type="text/javascript" src="/files/js/vue-resource.min.js"></script>
<script type="text/javascript" src="/files/js/phoneUsers.js"></script>

</html>
